<template>
  <van-config-provider :theme="theme">
    <router-view />
  </van-config-provider>
  <!-- <audio  hidden src="/src/assets/worn.mp3" ref="audio"></audio> -->
</template>

<script setup lang="ts">
import type { ConfigProviderTheme } from 'vant'
import { localStorage } from '@/utils/local-storage'
import { useStore } from '@/stores'

const store = useStore()
const theme = ref<ConfigProviderTheme>('light')
const mode = computed(() => store.mode)
console.log('👙 当前环境', process.env.NODE_ENV)
watch(mode, (val) => {
  if(val === 'dark' || localStorage.get('theme') === 'dark') {
    theme.value = 'dark'
    document.querySelector('html')
    .setAttribute('data-theme', 'dark')
  } else {
    theme.value = 'light'
    document.querySelector('html')
    .setAttribute('data-theme', 'light')
  }
}, { immediate: true })

</script>
